<script src="/echarts/echarts.common.min.js"></script>
<div>
    <div id="echart_{{ $cabinet['id'] }}" style="width: 100%;height:400px;"></div>
</div>

<script type="text/javascript">
    Dcat.ready(function () {
        var myChart = echarts.init(document.getElementById('echart_{{ $cabinet['id'] }}'));
 
        var chartXData = {!! $xData !!};
        var chartSeriesData = {!! $series !!};
        var chartLegendData = {!! $legend !!};

        var option = {
    title: {
        text: '{{ $cabinet['name'] }}'
    },
    tooltip: {
        trigger: 'axis'
    },
    legend: {
        data: chartLegendData
    },
    grid: {
        left: '3%',
        right: '4%',
        bottom: '3%',
        containLabel: true
    },
    // toolbox: {
    //     feature: {
    //         saveAsImage: {}
    //     }
    // },
    xAxis: {
        type: 'category',
        boundaryGap: false,
        data: chartXData
    },
    yAxis: {
        type: 'value'
    },
    series: chartSeriesData,
    dataZoom: [
        {startValue: '{{ $startValue }}'},

    ]
};
 
        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
    });
</script>